@mixin viewportWrapper {
  > .ng-scroll-viewport-wrapper {
    @content;
  }
}

// Viewport offset selector
// The default viewport is used to hide the native scrollbar
@mixin nativeScrollbarHider {
  @include viewportWrapper {
    > .ng-native-scrollbar-hider,
      // Custom viewport
      > * > * > ::ng-deep.ng-native-scrollbar-hider {
      @content;
    }
  }
}

// Default/Custom Viewport selector
@mixin viewport {
  @include viewportWrapper {
    // Default viewport
    > .ng-scroll-viewport,
      // Custom viewport
    > * > * > ::ng-deep.ng-scroll-viewport {
      @content;
    }
  }
}

@mixin content {
  > .ng-scroll-content {
    @content;
  }
}

@mixin enabled {
  &[deactivated="false"] {
    @content;
  }
}

// Vertical Scrollbar is used
@mixin scrollbarYUsed {
  &[verticalUsed="true"] {
    @content;
  }
}

// Horizontal Scrollbar is used
@mixin scrollbarXUsed {
  &[horizontalUsed="true"] {
    @content;
  }
}

// All Scrollbars are used
@mixin allUsed {
  &[verticalUsed="true"][horizontalUsed="true"] {
    @content;
  }
}

@mixin ltr {
  &[dir="ltr"] {
    @content;
  }
}

@mixin rtl {
  &[dir="rtl"] {
    @content;
  }
}

@mixin scrollbarYInverted {
  &[position="invertY"], &[position="invertAll"] {
    @content;
  }
}

@mixin scrollbarXInverted {
  &[position="invertX"], &[position="invertAll"] {
    @content;
  }
}

@mixin scrollbarY {
  > scrollbar-y.scrollbar-control {
    @content;
  }
}

@mixin fitScrollbarY {
  > scrollbar-y.scrollbar-control[fit="true"] {
    @content;
  }
}

@mixin scrollbarX {
  > scrollbar-x.scrollbar-control {
    @content;
  }
}

@mixin fitScrollbarX {
  > scrollbar-x.scrollbar-control[fit="true"] {
    @content;
  }
}

@mixin viewportPointerEvents {
  &[pointerEventsMethod="viewport"] {
    @content;
  }
}

@mixin scrollbarPointerEvents {
  &[pointerEventsMethod="scrollbar"] {
    @content;
  }
}

@mixin scrollbarXHovered {
  &[horizontalHovered="true"], &[horizontalDragging="true"] {
    @content;
  }
}

@mixin scrollbarYHovered {
  &[verticalHovered="true"], &[verticalDragging="true"] {
    @content;
  }
}

@mixin scrollbarInAction {
  &[horizontalDragging="true"], &[verticalDragging="true"], &[scrollbarClicked="true"] {
    @content;
  }
}
